<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:pr="http://primefaces.prime.com.tr/ui"
      xmlns:f="http://java.sun.com/jsf/core">

    <ui:composition template="WEB-INF/facelets/template.xhtml">

        <ui:param name="title" value="Product Listing"/>

        <ui:define name="content">
            <h:form>
                <pr:dataTable id="products" value="#{productListingBacking.products}" var="product">

                    <pr:column>
                        <f:facet name="header">
                            <h:outputText value="Image"/>
                        </f:facet>

                        <h:graphicImage id="productthumbnail"
                                        width="32"
                                        height="32"
                                        url="/img/no_product_image.jpg">
                        </h:graphicImage>                     


                    </pr:column>

                    <pr:column sortBy="#{product.name}">
                        <f:facet name="header">
                            <h:outputText value="Name"/>
                        </f:facet>
                        <h:outputText value="#{product.name}"/>
                    </pr:column>

                    <pr:column sortBy="#{product.category}">
                        <f:facet name="header">
                            <h:outputText value="Category"/>
                        </f:facet>
                        <h:outputText value="#{product.category}"/>
                    </pr:column>


                    <pr:column sortBy="#{product.price}">
                        <f:facet name="header">
                            <h:outputText value="Price"/>
                        </f:facet>
                        <h:outputText value="#{product.price-product.discount}"/>
                    </pr:column>
                    <pr:column>
                        <f:facet name="header">
                            <h:outputText value="Add to cart"/>
                        </f:facet>
                        <h:commandButton value="View" action="#{productBacking.viewProduct(product)}"/>
                        <h:commandButton value="Buy" action="#{cartModel.addProduct(product)}"/>
                    </pr:column>
                </pr:dataTable>
            </h:form>
        </ui:define>
    </ui:composition>
</html>

